import 'package:flutter/material.dart';
import 'package:flutter_pagewise/flutter_pagewise.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:cached_network_image/cached_network_image.dart';
import 'package:loxen/utils/config.dart';
import 'package:loxen/utils/image_url.dart';
import 'package:provider/provider.dart';
import 'package:loxen/mode/material/material_item.dart';
import 'package:loxen/routes/routes.dart';
import 'package:loxen/viewmode/search_result_viewmodel.dart';

class SearchMaterialListWidget extends StatelessWidget {
  final PagewiseLoadController<MaterialItem> controller;

  const SearchMaterialListWidget({Key key, this.controller}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return RefreshIndicator(
      onRefresh: () async {
        Provider.of<SearchResultViewModel>(context, listen: false).refresh();
        controller.reset();
      },
      child: Container(
        margin: EdgeInsets.only(top: 35.h, right: 35.w, left: 35.w),
        child: PagewiseGridView<MaterialItem>.count(
          addAutomaticKeepAlives: false,
          pageLoadController: controller,
//          loadingBuilder: (_) => Image.asset('images/loading.jfif'),
          crossAxisSpacing: 20.w,
          mainAxisSpacing: 20.w,
          childAspectRatio: 1,
          crossAxisCount: 2,
          itemBuilder: (context, entity, index) {
            return InkWell(
              onTap: () {
                Navigator.of(context)
                    .pushNamed(Routes.material_detail, arguments: entity.id);
              },
              child: Container(
                child: CachedNetworkImage(
                  imageUrl:  ImageUrlUtil.getClean(entity.cover),
                  placeholder: (_, __) => Constants.loadingIcon(),
                  fit: BoxFit.cover,
                ),
              ),
            );
          },
        ),
      ),
    );
  }
}
